import React from "react";
import CountDown from "@/components/common/countdown.tsx"; // 引入封装好的组件

const Emails = () => {
    const [form] = React.UI.Form.useForm();
    const [loading,setLoading] = React.useState(false);

    //添加：获取当前用户邮箱并设置表单初始化
    React.useEffect(() => {

        // 检查是否已绑定邮箱
        if (React.business?.auth === '1') {
            React.UI.Toast.show('邮箱已绑定');
            React.navigate(-1);
            return;
        }

        if(React.business?.email){
            form.setFieldsValue({
                email: React.business?.email,
            })
        }
    })

    //发送验证码
    const SendEmail = async () =>
    {
        // console.log();
        //获取邮箱
        const email1 = form.getFieldValue('email');
        // console.log(email1);
        if(!email1) {
            React.UI.toast.show('请输入邮箱');
            return;
        }
        setLoading(true);

        const param = {
            email:email1,
            id:React.business.id
        }

        const result = await React.http.post('/email/send',param)
        if(result.code === 1){
            React.UI.toast.show('发送成功');
        }else{
            React.UI.Toast.show(result.message || '验证码发送失败');
        }
        setLoading(false);
    }


    const EmailFinish = async (values:any) => 
    {
        // console.log(values);
        setLoading(true);
        const params = {
            ...values,
            id:React.business.id
        }

        const result = await React.http.post('/email/check',params);

        if(result.code === 1){
            React.UI.Toast.show('邮箱验证成功');
            // 更新用户信息
            React.business.email = values.email;
            React.business.auth = '1';
            React.Cookies.save('business', React.business, { path: '/' });
        // 返回上一页
        React.navigate(-1);
        }else{
            React.fail(result.msg);
        }
        setLoading(false);

    };

    return (
        <>
            <React.UI.Form
                form={form}
                onFinish={EmailFinish}
                layout="horizontal"
                footer={
                    <React.UI.Button block type="submit" color="primary" size="large" loading={loading}>
                        提交
                    </React.UI.Button>
                }
            >
                <React.UI.Form.Item
                    initialValue={React.business?.email || ''}
                    rules={[
                        { required: true, message: "请填写正确的邮箱" },
                        { type: "email", warningOnly: true },
                    ]}
                    name="email"
                    label="邮箱"
                >
                    <React.UI.Input placeholder="请输入邮箱" />
                </React.UI.Form.Item>

                <React.UI.Form.Item
                    label="邮箱验证码"
                    extra={
                        <CountDown
                            initialSeconds={10}
                            buttonTextBefore="发送验证码"
                            SendEmail={SendEmail}
                        />
                    }
                    name="code"
                    rules={[{ required: true, message: "验证码不能为空" }]}
                >
                    <React.UI.Input placeholder="请输入邮箱验证码" />
                </React.UI.Form.Item>
            </React.UI.Form>
        </>
    );
};

export default Emails;